<style>
    .mo-pagination {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 40px 0;
        font-size: 0;
    }
    .mo-pagination .mo-pagination-value, .mo-pagination .mo-pagination-handle {
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        box-sizing: border-box;
        margin: 0 5px;
    }

    .mo-pagination .mo-pagination-handle {
        overflow: hidden;
        cursor: pointer;
    }
    .mo-pagination .mo-pagination-handle path {
        fill:#1D1F21
    }

    .mo-pagination .mo-pagination-value {
        color: #1D1F21;
    }
    .mo-pagination .mo-pagination-value:hover{
        border: 1px solid #1D1F21;
    }
    .mo-pagination .mo-pagination-value-active{
        color: #1D1F21;
        border: 1px solid #1D1F21;
    }
    .mo-pagination .mo-pagination-handle-disable{
        cursor: not-allowed;
    }
    .mo-pagination .mo-pagination-handle-disable path{
        fill:#999999
    }
</style>
{% if paginate and paginate.current_page != 0 %}
<div class="mo-pagination">
    
    <a href="{% if paginate.current_page == 1 %}javascript:;{% else %}{{paginate.previous.url}}{% endif %}" class="mo-pagination-handle {% if paginate.current_page == 1 %}mo-pagination-handle-disable{% endif %}">
        <svg t="1632633670584" class="arrow-1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1448" width="16" height="16">
            <path d="M751.61600001 175.104l-360.0896 337.6128 359.67999999 336.0768a50.3296 50.3296 0 0 1 0 74.3936 58.88 58.88 0 0 1-79.4112 0.1024l-399.36-373.248a50.3296 50.3296 0 0 1 0-74.3424l399.7184-374.8864a58.88 58.88 0 0 1 79.4112-0.1024 50.3296 50.3296 0 0 1 0 74.3936z" p-id="1449" fill="#888888"></path>
        </svg>
    </a>
    {% for part in paginate.parts %}
    {% if part.is_link %}
    <a href="{{part.url}}" class="mo-pagination-value {% if part.title == paginate.current_page %}mo-pagination-value-active{% endif %}">{{ part.title }}</a>
    {% else %}
    <span class="mo-pagination-value">{{ part.title }}</span>
    {% endif %}
    {% endfor %}
    <a href="{% if paginate.current_page == paginate.pages %}javascript:;{% else %}{{paginate.next.url}}{% endif %}" class="mo-pagination-handle {% if paginate.current_page == paginate.pages %}mo-pagination-handle-disable{% endif %}">
        <svg t="1632633684430" class="arrow-1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1590" width="16" height="16">
            <path d="M272.384 848.896l360.0896-337.6128-359.68-336.0768a50.3296 50.3296 0 0 1 0-74.3936 58.88 58.88 0 0 1 79.4112-0.1024l399.36 373.248a50.3296 50.3296 0 0 1 0 74.3424l-399.7184 374.8864a58.88 58.88 0 0 1-79.4112 0.1024 50.3296 50.3296 0 0 1 0-74.3936z" p-id="1591" fill="#888888"></path>
        </svg>
    </a>
</div>
{% endif %}


